<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>表单自动检测</title>
</head>
<body>
    <form>
        <p>
            <label for="uname">姓名:</label>
            <input required="text" id="uname" name="username">
        </p>
        <p>
            <label for="email">邮箱:</label>
            <input type="email" required id="email" name="email">
        </p>
        <!--电话格式太多 无法验证-->
        <p>
            <label for="tel">电话:</label>
            <input type="tel" required id="tel" name="tel">
        </p>
        <p>
            <button type="submit">提交</button>
        </p>
    </form>   
    <!-- 补充讲解 使用15定义验证 例如验证手机号-->
    <script>
        var form = document.getElementsById("form");

        Form.onsubmit = function(e) {
            // 验证电话是否合格
            var tel = document.getElementsById("tel").value-0;
            if(tel >=13000000000 && tel <20000000000){
                // 验证通过
            }else
               alert("手机号非法");
               return false;
        }
    </script>
</body>
</html>